<template>
 <h1>属性绑定指令</h1>
  <input type="text" value="kk">
  <input type="text" value="info">
  <!--将input元素的value属性与info变量的值进行绑定,由info变量来控制输入框要显示的默认值 -->
  <input type="text" v-bind:value="info">
  <input type="text" :value="info">
  <hr>
<!--  此处url是一个响应式变量,用url来控制超链接跳转的位置-->
<!--  :href="url" 与v-bind:href="url"的写法是等价的 -->
  <a href="url">超链接</a>
  <a :href="url">超链接2</a>

</template>

<script setup>
import {ref} from "vue";
const info = ref('属性绑定55');
const url =ref("https://www.baidu.com");
url.value="https://www.jd.com"//JS使用响应式变量,必须 .value!
</script>

<style scoped>

</style>